<template>
    <div class="maind" style="padding-top:40px ;height: calc(100% - 5px);">
        <main>
            <el-header>
                <el-input placeholder="搜索参数" size="small" clearable v-model="queryInfo.key"
                    @clear="lookresetForm()"></el-input>
                <!-- 样本状态查询 -->
                <el-dropdown split-button class="look" size="small" @command="handleCommandAA"
                    style="margin-right: 15px;">
                    样本状态
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="A">全部样本</el-dropdown-item>
                        <el-dropdown-item command="1">入库</el-dropdown-item>
                        <el-dropdown-item command="2">出库</el-dropdown-item>
                    </el-dropdown-menu>
                </el-dropdown>

                <el-dropdown split-button @click="getassignmentList()" class="look" size="small"
                    @command="handleCommand" style="margin-right: 15px;">
                    查询
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="a">高级查询</el-dropdown-item>
                        <el-dropdown-item command="b">重置查询</el-dropdown-item>
                    </el-dropdown-menu>
                </el-dropdown>
                <!-- 高级查询 -->
                <el-dialog title="高级查询" :visible.sync="dialoglook">
                    <el-form :model="queryInfo" :rules="rules" ref="queryInfo" label-width="100px" size="mini"
                        class="demo-ruleForm">
                        <el-row :gutter="20">
                            <el-col :span="12">
                                <el-form-item label="样本编码">
                                    <el-input v-model="queryInfo.sampleCode"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="冰箱">
                                    <el-input v-model="queryInfo.equipmentName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="冻存架">
                                    <el-input v-model="queryInfo.shelfName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="冻存盒">
                                    <el-input v-model="queryInfo.boxCode"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="X列范围">
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.positionXStart"></el-input>
                                    </el-col>
                                    <el-col style="margin: 0 20px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.positionXEnd"></el-input>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="Y列范围">
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.positionYStart"></el-input>
                                    </el-col>
                                    <el-col style="margin: 0 20px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.positionYEnd"></el-input>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="采集时间">
                                    <el-col :span="5">
                                        <el-date-picker style="width: 85px;" v-model="queryInfo.receiveDateStart"
                                            type="date" value-format="yyyy-MM-dd" placeholder="开始时间"></el-date-picker>
                                    </el-col>
                                    <el-col style="width: 15px; margin: 0 19px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-date-picker style="width: 85px;" v-model="queryInfo.receiveDateEnd"
                                            type="date" value-format="yyyy-MM-dd" placeholder="结束时间"></el-date-picker>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="有效时间">
                                    <el-col :span="5">
                                        <el-date-picker style="width: 85px;" v-model="queryInfo.validityDateStart"
                                            type="date" value-format="yyyy-MM-dd" placeholder="开始时间"></el-date-picker>
                                    </el-col>
                                    <el-col style="width: 15px; margin: 0 19px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-date-picker style="width: 85px;" v-model="queryInfo.validityDateEnd"
                                            type="date" value-format="yyyy-MM-dd" placeholder="结束时间"></el-date-picker>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="容量范围">
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.initCapacityStart"></el-input>
                                    </el-col>
                                    <el-col style="margin: 0 20px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.initCapacityEnd"></el-input>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="年龄范围">
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.ageStart"></el-input>
                                    </el-col>
                                    <el-col style="margin: 0 20px;" class="line" :span="2">-</el-col>
                                    <el-col :span="5">
                                        <el-input style="width: 85px;" v-model="queryInfo.ageEnd"></el-input>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="姓名">
                                    <el-input v-model="queryInfo.sourceName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="性别">
                                    <el-radio-group v-model="queryInfo.sex">
                                        <el-radio label='1'>男</el-radio>
                                        <el-radio label='2'>女</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="身份证号">
                                    <el-input v-model="queryInfo.sourceIdCard"></el-input>
                                </el-form-item>
                            </el-col>

                            <el-col :span="12">
                                <el-form-item label="手机号">
                                    <el-input v-model="queryInfo.telephone"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="库存状态">
                                    <el-radio-group v-model="queryInfo.state">
                                        <el-radio label='1'>入库</el-radio>
                                        <el-radio label=' '>出库</el-radio>
                                    </el-radio-group>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-form-item>
                            <el-button type="primary" @click="lookget()">查询</el-button>
                            <el-button @click="resetForm()">取消</el-button>
                            <el-button @click="lookresetForm()">重置</el-button>
                        </el-form-item>
                    </el-form>
                </el-dialog>





                <el-button class="add" size="small" @click="addForms()">采集录入</el-button>
                <el-button class="delet" size="small" @click=" stateDelete(stateRows)">出库</el-button>
                <el-button class="delet" size="small" @click="exportToExcel">导出EXCEL</el-button>
            </el-header>
            <el-table style="height:calc(100% - 85px);" :data="assignmentList" border
                @selection-change="handleSelectionChange" size="mini" :row-style="{ height: '20px' }"
                :cell-style="{ padding: '0px' }">

                <!-- 选择框列 -->
                <el-table-column type="selection" width="50" fixed="left"></el-table-column>

                <el-table-column label="样本编码">
                    <template slot-scope="scope">
                        <span>{{ scope.row.sampleCode }}</span>
                    </template>
                </el-table-column>

                <el-table-column label="冰箱" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.equipmentName }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="冻存架" width="140">
                    <template slot-scope="scope">
                        <span>{{ scope.row.shelfCode }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="冻存盒" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.boxCode }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="第X行" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.x }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="第Y列" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.y }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="采集日期" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.receiveDate }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="姓名" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.sourceName }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="身份证号" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.sourceIdCard }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="性别">
                    <template slot-scope="scope">
                        <!-- <span>{{ scope.row.sex }}</span> -->
                        <span v-show="scope.row.sex == '1'">男</span>
                        <span v-show="scope.row.sex == '2'">女</span>
                    </template>
                </el-table-column>
                <el-table-column label="年龄" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.age }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="手机号" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.telephone }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="容量" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.initCapacity }}</span>
                    </template>
                </el-table-column>

                <el-table-column label="单位" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.unit }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="有效日期" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.validityDate }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="入库时间" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.createOn }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="入库人" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.createBy }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="出库时间" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.outStockOn }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="出库人" width="200">
                    <template slot-scope="scope">
                        <span>{{ scope.row.outStockBy }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="修改时间">
                    <template slot-scope="scope">
                        <span>{{ scope.row.modifiedOn }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="备注">
                    <template slot-scope="scope">
                        <span>{{ scope.row.remark }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="状态" fixed="right">
                    <template slot-scope="scope">
                        <!-- <span>{{ scope.row.status }}</span> -->
                        <span v-show="scope.row.state == '1'">入库</span>
                        <span v-show="scope.row.state == '2'" style="color: lime;">出库</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" fixed="right" width="100">
                    <template slot-scope="scope">
                        <el-button style="color: #17b3a3; " size="mini" type="text"
                            @click="handleEdit(scope.row)">编辑</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!-- 新增入库 -->
            <el-dialog v-if="id == ''" title="新增" :visible.sync="dialogFormVisible">
                <el-form :model="RRRROU" :rules="rules" ref="RRRROU" label-width="100px" size="mini"
                    class="demo-ruleForm">
                    <el-row :gutter="20">
                        <el-col :span="12">
                            <el-form-item label="容器">
                                <el-input v-model="RRRROU.rouqi"></el-input>
                                <el-button type="primary" @click="Rouclick" size="mini">容器选择</el-button>
                            </el-form-item>
                        </el-col>
                        <!-- 容器选择框 -->
                        <el-dialog title="容器选择" :visible.sync="RouqiDiago" append-to-body>
                            <el-input placeholder="搜索参数" size="small" clearable v-model="queryInfo.key"
                            @clear="geRouqiList()" style="width: 150px; margin-right: 15px;"></el-input>
                            <el-button type="primary" size="small">查询</el-button>
                            
                            <el-table :data="Rouqi" size="mini">
                                <el-table-column label="设备编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.code }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="设备名称" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.name }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="型号名称" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.equipmentModelName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="组名称" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.equipmentGroupName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="品牌" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.brand }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="型号" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.modelVersion }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="类型" width="180">
                                    <template slot-scope="scope">
                                        <!-- <span style="margin-left: 10px">{{ scope.row.item }}</span> -->
                                        <span v-show="scope.row.item == '1'">立式</span>
                                        <span v-show="scope.row.item == '3'">液态罐</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="位置编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.encodingType }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="层数" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.rowNums }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="列数" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.columnNums }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="宽度" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.width }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="深度" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.depth }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="高度" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.height }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="条形码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.barcode }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="二维码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.barcode2 }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="硬件编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.hardcode }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="状态" width="180">
                                    <template slot-scope="scope">
                                        <!-- <span style="margin-left: 10px">{{ scope.row.state }}</span> -->
                                        <span v-show="scope.row.state == '1'">启用</span>
                                        <span v-show="scope.row.state == '2'">禁用</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="是否大规格" width="180">
                                    <template slot-scope="scope">
                                        <!-- <span style="margin-left: 10px">{{ scope.row.sortCode }}</span> -->
                                        <span v-show="scope.row.sortCode == '1'">大规格</span>
                                        <span v-show="scope.row.sortCode == '2'">普通</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="生产日期" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.produceDate }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="使用日期" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.useDate }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="有效日期" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.validityDate }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="创建时间" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.createOn }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="修改时间" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.modifiedOn }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.remark }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" fixed="right" width="100">
                                    <template slot-scope="scope">
                                        <el-button size="mini"
                                            @click="handleEditT(scope.row)">选择</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <pagination :page="RouqiPage.page" :componentTotal="RouqiTatol" @changeRows="setRows" @changePage="setPage">
                            </pagination>
                        </el-dialog>


                        <el-col :span="12">
                            <el-form-item label="冻存架">
                                <el-input v-model="RRRROU.jia"></el-input>
                                <el-button type="primary" size="mini" @click="jiaclick">冻存架选择</el-button>
                            </el-form-item>
                        </el-col>
                        <!-- 冻存架选择 -->
                        <el-dialog title="冻存架选择" :visible.sync="JiaDiago" append-to-body>
                            <el-input placeholder="搜索参数" size="small" clearable v-model="queryInfo.key"
                            @clear="geJiaList()" style="width: 150px; margin-right: 15px;"></el-input>
                            <el-button type="primary" size="small">查询</el-button>
                            
                            <el-table :data="Jia" size="mini">
                                <el-table-column label="编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.code }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="规格" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.shelfTypeName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="容器名称" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.equipmentName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="第X行" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.rowNo }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="第Y列" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.columnNo }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="行数" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.rowNums }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="列数" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.columnNums }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="条形码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.barcode }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="条形码2" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.barcode2 }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="硬件编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.hardcode }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="修改时间" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.modifiedOn }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.remark }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" fixed="right" width="100">
                                    <template slot-scope="scope">
                                        <el-button size="mini"
                                            @click="handleEditTJ( scope.row)">选择</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <pagination :page="JiaPage.page" :componentTotal="JiaTatol" @changeRows="setRows" @changePage="setPage">
                            </pagination>
                        </el-dialog>

                    
                        
                        
                        <el-col :span="24">
                            <el-form-item label="冻存盒">
                                <el-input v-model="RRRROU.box"></el-input>
                                <el-button type="primary" size="mini" @click="heclick">冻存盒选择</el-button>
                            </el-form-item>
                        </el-col>
                         <!-- 冻存盒选择 -->
                         <el-dialog title="冻存盒选择" :visible.sync="heDiago" append-to-body>
                            <el-input placeholder="搜索参数" size="small" clearable v-model="queryInfo.key"
                            @clear="geJiaList()" style="width: 150px; margin-right: 15px;"></el-input>
                            <el-button type="primary" size="small">查询</el-button>
                            
                            <el-table :data="he" size="mini">
                                <el-table-column label="冻存架" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.shelfName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="第X行" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.rowNo }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="第Y列" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.columnNo }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="规格" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.boxTypeName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="冻存盒编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.code }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="冰箱" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.equipmentName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.remark }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" fixed="right" width="100">
                                    <template slot-scope="scope">
                                        <el-button size="mini"
                                            @click="handleEditTJH( scope.row)">选择</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <pagination :page="hePage.page" :componentTotal="heTatol" @changeRows="setRows" @changePage="setPage">
                            </pagination>
                        </el-dialog>





                        
                        <el-col :span="12">
                            <el-form-item label="第X行">
                                <el-input-number v-model="RRRROU.x" :min="1" :max="100"  @change="addx" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="第Y列">
                                <el-input-number v-model="RRRROU.y" :min="1" :max="100"  @change="addy" />
                            </el-form-item>
                        </el-col>



                        

                        
                        <el-col :span="12">
                            <el-form-item label="样本采集">
                                <el-input v-model="RRRROU.yangname"></el-input>
                                <el-button type="primary" size="mini" @click="yangclick">样本</el-button>
                            </el-form-item>
                        </el-col>
                         <!-- 样本采集选择 -->
                            <el-dialog title="样本采集选择" :visible.sync="yangDiago" append-to-body>
                            <el-input placeholder="搜索参数" size="small" clearable v-model="queryInfo.key"
                            @clear="geJiaList()" style="width: 150px; margin-right: 15px;"></el-input>
                            <el-button type="primary" size="small">查询</el-button>
                            
                            <el-table :data="yang" size="mini">
                                <el-table-column label="样本编码" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.sampleCode }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="姓名" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.sourceName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="采集地点" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.collectAddressName }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="性别" width="180">
                                    <template slot-scope="scope">
                                        <!-- <span style="margin-left: 10px">{{ scope.row.sex }}</span> -->
                                        <span style="margin-left: 10px" v-show="scope.row.sex == '1'">男</span>
                                        <span style="margin-left: 10px" v-show="scope.row.sex == '2'">女</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="身份证号" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.idCard }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="年龄" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.age }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="180">
                                    <template slot-scope="scope">
                                        <span style="margin-left: 10px">{{ scope.row.remark }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="状态" width="180">
                                    <template slot-scope="scope">
                                        <!-- <span style="margin-left: 10px">{{ scope.row.status }}</span> -->
                                        <span style="margin-left: 10px" v-show="scope.row.status == '0'">未审</span>
                                        <span style="margin-left: 10px" v-show="scope.row.status == '1'">已审</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" fixed="right" width="100">
                                    <template slot-scope="scope">
                                        <el-button size="mini"
                                            @click="handleEditTJHY( scope.row)">选择</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <pagination :page="yangPage.page" :componentTotal="yangTatol" @changeRows="setRows" @changePage="setPage">
                            </pagination>
                        </el-dialog>
                        




                        
                        <el-col :span="12">
                            <el-form-item label="有效日期">
                                <el-date-picker v-model="RRRROU.time" type="date"   format="yyyy-MM-dd"
                                    value-format="yyyy-MM-dd HH:mm:ss"
                                    default-time="00:00:00"  placeholder="选择日期时间">
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="初始容量">
                                <el-input-number v-model="RRRROU.liang" :min="1" :max="100"  @change="Age" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="单位">
                                <el-input v-model="RRRROU.ml"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="24">
                            <el-form-item label="备注">
                                <el-input type="textarea" :rows="2" placeholder="请输入内容"
                                    v-model="RRRROU.bei">
                                </el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item>
                        <el-button type="success" @click="addForm(sampleCollectList)">添加</el-button>
                        <el-button @click="resetForm(sampleCollectList)">取消</el-button>
                    </el-form-item>
                </el-form>
            </el-dialog>

            <pagination :page="queryInfo.page" :componentTotal="total" @changeRows="setRows" @changePage="setPage">
            </pagination>


        </main>
    </div>
</template>

<script>
import Pagination from "./Pagination.vue";
// import { excelExportUseJson } from "../excel/xlsx.js";
export default {
    data() {
        return {
            id: '',
            dialogFormVisible: false,
            dialoglook: false,
            esdisabled: true,
            btndisabled: true,
            total: 0,
            queryInfo: {
                t: '',
                page: 1,
                limit: 10,
                key: '',
                sampleCode: '',//样本编码
                equipmentName: '',//冰箱
                shelfName: '',//冻存架
                boxCode: '',//冻存盒
                sourceName: '',//姓名
                sourceIdCard: '',//身份证
                telephone: '',//手机号
                selectSampleState: '',
                positionXStart: '',//x开始
                positionXEnd: '',//x结束
                positionYStart: '',//y开始
                positionYEnd: '',//y结束
                receiveDateStart: '',//采集开始时间
                receiveDateEnd: '',//采集结束时间
                validityDateStart: '',//有效期开始
                validityDateEnd: '',//有效期结束
                initCapacityStart: '',//容量开始
                initCapacityEnd: '',//容量结束
                state: '',// 1=入库 2=出库
                sex: '',//性别
                ageStart: '',//年龄开
                ageEnd: '',//年龄结束
            },
            assignmentList: [],
            //信息录入信息
            sampleCollectList:{
                "t": 1729408751207,
                "sampleId": 0,//样本采集ID ||
                "sampleCode": "",//样本采集的编码||
                "barcode": "",
                "state": "",
                "deleted": "",
                "isAttachment": "",
                "equipmentId": 0,//冰箱ID ||
                "shelfId": 0,//冻存架ID ||
                "boxId": 0,//冻存盒ID ||
                "positionX": 1,//X||
                "positionY": 1,//Y||
                "innerCode": "",
                "initCapacity": 3,//容量||
                "capacity": "",
                "unit": "ML",//单位
                "freezingNum": "",
                "validityDate": "2024-10-20 00:00:00",//有效期
                "parentBarcode": "",
                "type": "",
                "cellMakerId": "",
                "createOn": "2024-10-20 21:11:19",
                "createUserId": "",
                "createBy": "",
                "modifiedOn": "2024-10-20 21:11:19",
                "modifiedUserId": "",
                "modifiedBy": "",
                "remark": ""//备注
            },
            //信息添加时候表单数据
            RRRROU:{
                rouqi:'',//容器名称
                jia:'',//冻存架
                box:'',//盒子
                x:'',
                y:'',
                yangname:'',//样本名称
                time:'2024-10-20 21:11:19',//有效日期
                liang:'',//容量
                ml:'ML',//单位
                bei:''//备注
            },
            sampleTypeNameFF: [
                { label: "外周血", value: "外周血" },
                { label: "血浆", value: "血浆" },
                { label: "血清", value: "血清" },
                { label: "血细胞", value: "血细胞" },
                { label: "白细胞", value: "白细胞" },
                { label: "血小板", value: "血小板" },
                { label: "32432", value: "32432" },
            ],
            collectAddressNameFF: [
                { label: "奎文婚检", value: "奎文婚检" },
                { label: "淮城婚检", value: "淮城婚检" },
                { label: "高新区婚检", value: "高新区婚检" },
                { label: "坊子婚检", value: "坊子婚检" },
                { label: "寒亭婚检", value: "寒亭婚检" },
                { label: "高密婚检", value: "高密婚检" },
                { label: "寿光婚检", value: "寿光婚检" },
            ],
            addassignment: {
                code: '',
                name: '',
                remark: '',
                t: ''
            },
            stateRows: [],
            selectedRows: [],
            rules: {
                idCard: [
                    { min: 15, max: 15, required: true, message: "请填写正确身份证号", trigger: "blur" },
                ],
                sampleTypeName: [
                    { required: true, message: "样本类型不能为空", trigger: "change" },
                ],
                sampleCode: [
                    { required: true, message: "样本编号不能为空", trigger: "blur" },
                ],
                code: [
                    { required: true, message: "任务编码不能为空", trigger: "blur" },
                ],
                name: [
                    { required: true, message: "名称不能为空", trigger: "blur" },
                ],
            },
            
            //容器数据
            RouqiDiago: false,//容器弹框
            Rouqi: [],//容器数据
            RouqiTatol:0,//最大页码
            RouqiPage:{//页码树
                page:1,
                limit:10,
                k:'',
                t:'',
            },

            //冻存架数据
            JiaDiago: false,//冻存架弹框
            Jia: [],//冻存架数据
            JiaTatol:0,//最大页码
            JiaPage:{//页码树
                page:1,
                limit:10,
                k:'',
                t:'',
                equipmentId:'28',
            },
            
            //冻存盒数据
            heDiago: false,//冻存盒弹框
            he: [],//冻存盒数据
            heTatol:0,//最大页码
            hePage:{//页码树
                page:1,
                limit:10,
                k:'',
                t:'',
                shelfId:'4007',
            },
            
            yangDiago: false,//样本弹框
            yang: [],//样本数据
            yangTatol:0,//最大页码
            yangPage:{//页码树
                page:1,
                limit:10,
                k:'',
                t:'',
            },
            //打印模板
            listHeader: {
                age: '年龄',
                equipmentName: '样本编码',
                remark: '备注'
            },
        }
    },
    methods: {
        //容器的查询
        async geRouqiList() {
            this.RouqiPage.t = new Date().getTime()
            const { data: res } = await this.axios.get("api/biosample/equipment/list", {
                params: this.RouqiPage
            })
            // console.log(res);
            this.Rouqi = res.page.list;
            // console.log(this.assignmentList);
            this.RouqiTatol = res.page.totalCount;//最大页数
            if (res.code != 0) return this.$message.error("获取容器列表失败");
        },
        //容器的选择
        handleEditT(row) {
        console.log(row);
        this.RRRROU.rouqi = row.name;
        this.sampleCollectList.equipmentId = row.id;//冰箱ID
        this.JiaPage.equipmentId = row.id;//冻存架与容器联动
        this.RouqiDiago = false;
        },
        //容器弹出框
        Rouclick(){
            this.RouqiDiago = true;
            this.geRouqiList();
        },
//----------------------------------------------------------------------------------------------------------------
        //冻存架查询
        async geJiaList() {
            this.JiaPage.t = new Date().getTime()
            const { data: res } = await this.axios.get("api/biosample/forzenshelf/list", {
                params: this.JiaPage
            })
            // console.log(res);
            this.Jia = res.page.list;
            // console.log(this.assignmentList);
            this.JiaTatol = res.page.totalCount;//
        },
         //架子的选择
        handleEditTJ(row) {
        // console.log(row);
        this.RRRROU.jia = row.code;
        this.sampleCollectList.shelfId = row.id;//架子ID
        this.hePage.shelfId=row.id;//冻存盒与冻存架联动
        this.JiaDiago = false;
              },
        //冻存架弹出框
        jiaclick(){
            this.JiaDiago = true;
            this.geJiaList();
        },
//--------------------------------------------------------------------------------------------------------------
        //冻存盒查询
        async geHeList() {
            this.hePage.t = new Date().getTime()
            const { data: res } = await this.axios.get("api/biosample/forzenbox/list", {
                params: this.hePage
            })
            // console.log(res);
            this.he = res.page.list;
            // console.log(this.assignmentList);
            this.heTatol = res.page.totalCount;//
        },
        //冻存盒的选择
        handleEditTJH(row) {
        // console.log(row);
        this.RRRROU.box = row.code;
        this.sampleCollectList.boxId = row.id;//冻存盒ID
        this.heDiago = false;
        },
        heclick(){
            this.heDiago = true;
            this.geHeList();
        },
//----------------------------------------------------------------------------------------------------------------
        //样本查询
        async geYangList() {
            this.yangPage.t = new Date().getTime()
            const { data: res } = await this.axios.get("api/biosample/samples/select-list", {
                params: this.yangPage
            })
            // console.log(res);
            this.yang = res.page.list;
            // console.log(this.assignmentList);
            this.yangTatol = res.page.totalCount;//
        },
        //样本的选择
        handleEditTJHY(row) {
        console.log(row);
        this.RRRROU.yangname = row.sampleCode;
        this.sampleCollectList.sampleCode = row.sampleCode;
        this.sampleCollectList.sampleId = row.id;//样本ID
        this.yangDiago = false;
        },
        yangclick(){
            this.yangDiago = true;
            this.geYangList();
        },
//-----------------------------------------------------------------------------------------------------------
        //查看样本状态
        handleCommandAA(comres) {
            if (comres == "A") {
                this.lookresetForm()
            } else if (comres == "1") {
                this.queryInfo.state = 1
                this.getassignmentList()
            } else {
                this.queryInfo.state = 2
                this.getassignmentList()
            }
        },
        //高级查询
        handleCommand(command) {
            // this.$message('click on item ' + command);
            if (command == "a") {
                this.dialoglook = true;
            } else {
                this.getassignmentList()
            }
        },
        lookget() {
            this.getassignmentList();
            this.dialoglook = false;
        },

        //导出EXCEL
        exportToExcel() {
            // let formatList = this.assignmentList
            // formatList.map(el => {
            //     el.sex = el.sex == 1 ? "男" : '女';
            //     el.pregnant = el.pregnant == 0 ? "否" : "是";
            //     el.state = el.state == 1 ? "入库" : "出库";
            //     el.status = el.status == 0 ? "未审" : "已审"
            // })
            // excelExportUseJson(formatList, this.listHeader, "样本采集信息表");
        },
        //添加操作
        addForms() {
            this.id = '';
            this.sampleCollectList ={
                "t": 1729408751207,
                "sampleId": 0,//样本采集ID ||
                "sampleCode": "",//样本采集的编码||
                "barcode": "",
                "state": "",
                "deleted": "",
                "isAttachment": "",
                "equipmentId": 0,//冰箱ID ||
                "shelfId": 0,//冻存架ID ||
                "boxId": 0,//冻存盒ID ||
                "positionX": 1,//X||
                "positionY": 1,//Y||
                "innerCode": "",
                "initCapacity": 3,//容量||
                "capacity": "",
                "unit": "ML",//单位
                "freezingNum": "",
                "validityDate": "2024-10-20 21:11:19 00:00:00",//有效期
                "parentBarcode": "",
                "type": "",
                "cellMakerId": "",
                "createOn": "2024-10-20 21:11:19",
                "createUserId": "",
                "createBy": "",
                "modifiedOn": "2024-10-20 21:11:19",
                "modifiedUserId": "",
                "modifiedBy": "",
                "remark": ""//备注
            }
            this.dialogFormVisible = true;
        },
        // 获取任务列表
        async getassignmentList() {
            this.queryInfo.t = new Date().getTime()
            const { data: res } = await this.axios.get("api/biosample/samplesdetail/list", {
                params: this.queryInfo
            })
            console.log(res);
            this.assignmentList = res.page.list;
            // console.log(this.assignmentList);
            this.total = res.page.totalCount;//最大页数
            if (res.code != 0) return this.$message.error("获取任务列表失败");
        },
        // 分页器
        setRows(val) {
            this.queryInfo.limit = val;
            //容器查询
            this.RouqiPage.limit = val;
            //架子查询
            this.JiaPage.limit = val;
            //盒子查询
            this.hePage.limit =val;
            //样本查询
            this.yangPage.limit = val;
            this.geYangList()
            this.geRouqiList()
            this.geJiaList();
            this.geHeList();
            this.getassignmentList();
        },
        setPage(val) {
            this.queryInfo.page = val;
            //容器查询
            this.RouqiPage.page = val;
            //架子查询
            this.JiaPage.page = val;
            //盒子
            this.hePage.page = val;
            //样本
            this.yangPage.page = val;
            this.geYangList()
            this.geRouqiList()
            this.geJiaList();
            this.geHeList();
            this.getassignmentList();
        },
        //批量删除
        handleSelectionChange(selection) {
            this.selectedRows = selection;
            // console.log('Selected Rows:', this.selectedRows);
            this.selectedRows = selection.map(item => {
                if (item.status == 2) return
                this.esdisabled = false
                return item.id
            });
            this.stateRows = selection.map(item => {
                return item.id
            });
            if (this.selectedRows.length <= 0) {
                this.esdisabled = true
            }
            // console.log( this.selectedRows);
            // if (this.selectedRows.length > 0) {
            //     this.esdisabled = false
            // } else {
            //     this.esdisabled = true
            // }

        },
        machDelete(id) {
            console.log(id);
            this.$confirm(`是否选择[${id}]数据?`, "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.deleteassignment(id);
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消",
                    });
                });
        },
        stateDelete(id) {
            console.log(id);
            this.$confirm(`是否选择[${id}]数据?`, "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.stateRowss(id);
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消",
                    });
                });
        },
        async deleteassignment(id) {
            // console.log(this.selectedRows);
            const { data: res } = await this.axios.post("api/biosample/samples/apply", id);
            if (res.code != 0) return this.$message.error("审核入库失败");
            this.$message.success("审核入库成功");
            this.getassignmentList();
        },
        async stateRowss(id) {
            // console.log(this.selectedRows);
            const { data: res } = await this.axios.post("api/biosample/samplesdetail/out-stock", id);
            if (res.code != 0) return this.$message.error("出库失败");
            this.$message.success("出库成功");
            this.getassignmentList();
        },
        //重置
        lookresetForm() {
            const defaultQueryInfo = {
                t: '',
                page: 1,
                limit: 10,
                key: '',
                sampleCode: '',//样本编码
                equipmentName: '',//冰箱
                shelfName: '',//冻存架
                boxCode: '',//冻存盒
                sourceName: '',//姓名
                sourceIdCard: '',//身份证
                telephone: '',//手机号
                selectSampleState: '',
                positionXStart: '',//x开始
                positionXEnd: '',//x结束
                positionYStart: '',//y开始
                positionYEnd: '',//y结束
                receiveDateStart: '',//采集开始时间
                receiveDateEnd: '',//采集结束时间
                validityDateStart: '',//有效期开始
                validityDateEnd: '',//有效期结束
                initCapacityStart: '',//容量开始
                initCapacityEnd: '',//容量结束
                state: '',// 1=入库 2=出库
                sex: '',//性别
                ageStart: '',//年龄开
                ageEnd: '',//年龄结束
            };

            this.queryInfo = { ...defaultQueryInfo };
            this.getassignmentList()
        },
        //取消操作
        resetForm() {
            this.dialogFormVisible = false;
            this.dialoglook = false;
            this.id = '';
        },
        //单个删除
        handleDelete(row) {
            console.log(row);
            this.$confirm(`是否删除[${row.id}]数据?`, "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.deleteTeam(row.id);
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消删除",
                    });
                });
        },
        async deleteTeam(id) {
            const { data: res } = await this.axios.post(`api/biosample/samples/delete`, [id]);
            if (res.code != 0) return this.$message.error("删除失败");
            this.$message.success("删除成功");
            this.getassignmentList();
        },
        //添加新增
        async addForm() {
            // console.log(formName);
            this.sampleCollectList.t = new Date().getTime();
            this.sampleCollectList.validityDate =this.RRRROU.time;
            this.sampleCollectList.remark = this.RRRROU.bei;
            this.sampleCollectList.unit = this.RRRROU.ml;
            const { data: res } = await this.axios.post("api/biosample/samplesdetail/save", this.sampleCollectList);
            if (res.code != 0) return this.$message.error("新增录入失败");
            this.$message.success("新增录入成功");
            this.dialogFormVisible = false;
            this.getassignmentList();
        },
        //加减框
        //x的加减
        Age(val){
            this.RRRROU.liang = val;
            this.sampleCollectList.initCapacity = val;//容量
            
        },
        addx(val) {
            //    console.log(val);
            this.RRRROU.x = val;
            this.sampleCollectList.positionX = val;
            // console.log(this.sampleCollectList.donorsInfo.age);
        },
        addy(val) {
            //    console.log(val);
            this.RRRROU.y = val;
            this.sampleCollectList.positionY = val;
            // console.log(this.sampleCollectList.donorsInfo.age);
        },
    },
    mounted() {
        this.getassignmentList()
    },
    components: {
        Pagination
    }
}
</script>

<style lang="scss" scoped>
::v-deep .el-table .cell {
    text-align: center;
}

main {

    padding: 20px;
    background-color: #fff;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
}

.el-header {
    padding: 0;
    float: left;
    width: 100%;
    ;

    .el-input {
        width: 185px;
        margin-right: 15px;
    }

    .delet {
        color: #fff;
        background-color: #fab6b6;
        border-color: #fab6b6;
    }

    .active {
        color: #fff;
        background-color: #f56c6c;
        border-color: #f56c6c;
    }

    .add {
        color: #fff;
        background-color: #17b3a3;
        border-color: #17b3a3;
    }
}

::v-deep input[aria-hidden="true"] {
    display: none !important;
}

::v-deep .el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
    box-shadow: none;
}
</style>